<template>
	<view class="specifications">
		<statusBar />
		<!-- 设置 -->
		<view class="nav" @tap="leftIndex">
			<image src="../../static/setup/jiantou.png" mode=""></image>
			<view>商品-编辑-管理规格</view>
		</view>
		<view class="search">
			<view>商品规格(调高加格可能需经过市场经理审核)</view>

			<!-- 规格名 -->
			<view class="Specifi" v-for="(item, index) in createNumber" :key="index">
				<view>
					<view>规格名</view>
					<input type="text" v-model="item.name" value="" placeholder="如大杯 中杯 6寸" />
				</view>

				<!-- 价格 -->
				<view class="plice">
					<view>价格</view>
					<view><input type="text" v-model="item.name" value="" placeholder="30.00" /></view>
					<view>元</view>
				</view>

				<!-- 餐盒费 -->
				<view class="plice">
					<view>餐盒费</view>
					<view><input style="margin-left: 105upx;" v-model="item.name" type="text" value="" placeholder="0.00" /></view>
					<view>元</view>
				</view>

				<!-- 当前库存 -->
				<view class="inventory">
					<view>当前库存</view>
					<view><input type="text" v-model="item.name" value="" placeholder="0" /></view>
					<view>
						<view>沽清</view>
						<view>置满</view>
					</view>
				</view>

				<!-- 最大库存 -->
				<view class="Largest">
					<view>最大库存</view>
					<input type="text" v-model="item.name" value="" placeholder="1000" />
				</view>

				<!-- 库存次日置满 -->
				<view class="was">
					<view>
						<view>库存次日置满</view>
						<image src="../../static/management/yiwen.png" mode=""></image>
					</view>
					<view><u-switch v-model="send" @change="change"></u-switch></view>
				</view>

				<!-- 热量 -->
				<view class="heat">
					<view>热量</view>
					<input v-model="item.name" type="text" value="" />
					<view>kcal/100g</view>
				</view>

				<!-- 重量 -->
				<view class="heat">
					<view style="width: 10%;">重量</view>
					<input v-model="item.name" type="text" value="" />
					<view>克</view>
				</view>

				<!-- 条形码 -->
				<view class="Bar">
					<view>条形码</view>
					<input v-model="item.name" type="text" value="" placeholder="选填" />
				</view>

				<!-- 删除 -->
				<view class="detail" @click="deleteItem(index)">删除该规格</view>
			</view>
		</view>

		<!-- 保存 -->
		<view class="new">
			<view @click="createInput">新建规格</view>
			<view>保存设置</view>
		</view>
	</view>
</template>
<script>
import statusBar from '../../components/statusBar/statusBar.vue';
export default {
	data() {
		return {
			send: false,
			createNumber: [{ name: '大杯奶茶' }]
		};
	},
	components: {
		statusBar
	},
	methods: {
		leftIndex() {
			uni.navigateBack({
				delta: 1
			});
		},
		change(status) {
			console.log(status, 1111);
		},
		// 新增
		createInput() {
			this.createNumber.push({ name: '' });
		},
		// 删除
		deleteItem(index){
			 this.createNumber.splice(index, 1)
			  console.log(index)
		}
	}  
};
</script>
<style lang="scss" scoped>
	@import './scss/specifications.scss';

</style>
